<template>
  <div class="mod-config">
    <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
      <el-button type="primary" @click="addOrUpdateHandle()">修改</el-button>
    </el-form>
    <el-form :model="dataForm" label-width="140px">
      <el-form-item label="姓名:">
        <!-- <el-input v-model="data.storeName"></el-input> -->
        <label>{{dataForm.storekeeperName}}</label>
      </el-form-item>
      <el-form-item label="电话:">
        <label>{{dataForm.phoneNumber}}</label>
      </el-form-item>
      <el-form-item label="身份证号码:">
        <label>{{dataForm.identityNumber}}</label>
      </el-form-item>
      <el-form-item label="邮箱:">
        <label>{{dataForm.email}}</label>
      </el-form-item>
    </el-form>
    <!-- 弹窗, 新增 / 修改 -->
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="init"></add-or-update>
  </div>
</template>

<script>
import AddOrUpdate from "./storekeeper-add-or-update";
export default {
  data() {
    return {
      dataForm: {
        storekeeperId: 0,
        storekeeperName: "",
        phoneNumber: "",
        // password: "",
        identityNumber: "",
        email: "",
      },
      storeKeeperId: 0,
      dataLoading: false,
      addOrUpdateVisible: false,
    };
  },
  components: {
    AddOrUpdate,
  },
  activated() {
    // this.getDataList()
  },
  created() {
    this.storeKeeperId = this.$route.params.storekeeperId;
  },
  methods: {
    // 获取数据列表
    init(id) {
      this.storekeeperId = id ? id : this.storeKeeperId;
      this.dataListLoading = true;
      this.$http
        .get(`${process.env.URL_HEAD}/store/storekeeper/info/${id ? id : this.storeKeeperId}`, {
          withCredentials: true,
        })
        .then(({ data }) => {
          if (data && data.code === 0) {
            this.dataForm.storekeeperId = data.storekeeper.storekeeperId;
            this.dataForm.storekeeperName = data.storekeeper.storekeeperName;
            this.dataForm.phoneNumber = data.storekeeper.phoneNumber;
            // this.dataForm.password = data.storekeeper.password;
            this.dataForm.identityNumber = data.storekeeper.identityNumber;
            this.dataForm.email = data.storekeeper.email;
            this.storekeeperId = data.storekeeper.storekeeperId;
          }
          this.dataListLoading = false;
          // console.log("storeKeeper:",this.dataForm);
        });
    },
    // 获取数据列表
    getDataList(id) {
      this.dataListLoading = true;
      this.$http(
        `${process.env.URL_HEAD}/store/storekeeper/info/${
          this.storekeeperId ? this.storekeeperId : 0
        }`,
        { withCredentials: true }
      ).then(({ data }) => {
        if (data && data.code === 0) {
          this.dataForm.storekeeperName = data.storekeeper.storekeeperName;
          this.dataForm.phoneNumber = data.storekeeper.phoneNumber;
          // this.dataForm.password = data.storekeeper.password;
          this.dataForm.identityNumber = data.storekeeper.identityNumber;
          this.dataForm.email = data.storekeeper.email;
        }
        this.dataListLoading = false;
      });
    },
    // 修改
    addOrUpdateHandle() {
      this.addOrUpdateVisible = true;
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(this.storekeeperId);
        // console.log("UpdateStoreKeeper,id=",this.dataForm.storekeeperId);
      });
    },
  },
};
</script>
